:root {
	--blue : #5c9bbe;
}

body {
	background : #fff;
	font-size: 15px;
}

.card-border-color {
border-top-color : #fff!important; }

@media only screen and (max-width: 48em){
	.relative {
		position: relative;
	}
	.btn-primary {
		background-color: var(--blue);
		border-color: var(--blue);
	}
	a {
		color: var(--blue);
	}
	.col-xl-1 {
		width: 8.33%;
	}

	.col-xl-2 {
		width: 16.67%;
	}

	.col-xl-3 {
		width: 25%;
	}

	.col-xl-4 {
		width: 33.33%;
	}

	.col-xl-5 {
		width: 41.67%;
	}


	.col-xl-6 {
		width: 50%
	}

	.col-xl-7 {
		width: 58.33%
	}

	.col-xl-8 {
		width: 66.67%
	}

	.col-xl-10 {
		width: 83.33%
	}

	.col-xl-12 {
		width: 100%;
	}

	.row .donao {
		margin-right: 10px;
		margin-left: 10px;
	}

	.home .row , .btndangky{
		margin-top: 10px;
	}

	.btndangky a, .btndangky a:hover{
		font-size: 24px;
	}

	img {
		width: 	100%;
	}	

	.be-wrapper{
		padding-top: 0px;
		max-width: 100%;
	}

	.bold {
		font-weight: 600;
	}

	.uppercase {
		text-transform: uppercase;
	}

	.login-submit, .row.login-submit {
		padding:0;
	}

	.login .card{
		/*background-image: linear-gradient(rgba(255, 255, 255, 0.65) 0%, rgb(255, 255, 255) 100%), url(../../images/bg.jpg);*/
	    min-height: 100vh;
	    background-repeat: no-repeat;
	    background-size: cover;
	}
	.login img {
		width: 50%;
		display: block;
		margin: 0 auto;
	}

	.login input, .login button {
		border-radius: 99px;
	}

	.jet-btn, .jet-btn:hover, .jet-link-step , .jet-link-step:hover {
		padding: 10px 35px;
		border-radius: 99px;
		background: var(--blue);
		color: #fff!important;
		font-size: 16px;
		border: 0;
	}

	.jet-link{
		font-size: 16px;
		height: 30px;
	}

	.jet-link-white, .jet-link-white:hover {
		color: #fff;
	}

	.jet-link i {
		font-size: 16px;
		line-height: 30px;
		animation: moveicon 1s infinite;
		width: 30px;
	}


	.swal2-shown .swal2-popup .swal2-actions {
		justify-content: center;
	}

	.home {
		margin-left: 0;
	}

	.home:after {
		content : "";
		height: 100px;
		display: block;
	}


	.home .thongbao {
		height: 50px;
		background: var(--blue);
		color: white;
		display: flex;
		align-items: center;
	}

	.home .thongbao .col-lg-6 {
		width: 50%;
	}

	.donao {
		/*height: 30px;*/
		border-radius: 10px;
		background: #f1f1f1;
		line-height: 30px;
	}

	.thutuc .col-lg-12 {
		margin-right: 10px;
		margin-left: 10px;
		margin-top:15px;
		border-radius: 99px;
		border: 1px solid var(--blue);
		padding: 10px 0px 10px 20px;
		color: var(--blue);
 		font-size: 15px;
	}


	.thutuc .col-lg-12 i {
		float: right;
		padding-right: 20px;
		font-size: 18px;
	}

	.thutuc div:nth-child(1) i{color: red; transition: transform 1s ease}
	.thutuc div:nth-child(2) i{color: blue; transition: transform 1s ease}
	.thutuc div:nth-child(3) i{color: green; transition: transform 1s ease}

	.thutuc div:nth-child(1):hover i, .thutuc div:nth-child(2):hover i, .thutuc div:nth-child(3):hover i {transform: scale(1.5);}


	.tab-header {
		display: flex;
		align-items: center;
		background: var(--blue);
		height: 50px;
		line-height: 50px;
		color: #fff;
		font-size: 25px;
	}

	.sotienvay{
		margin-top: 0px!important;
		background: linear-gradient(180deg, #0270af, #0270af00);
	    padding: 10px 0 0px 0 !important;
	    
	}

	.sotienvay .col-xl-12{
		margin-bottom: -20px
	}

	.sotienvay label {
		color: #fff;
		padding-left: 10px;
		padding-top: 10px;
		font-size: 15px;
	}

	.sotienvay input, .sotienvay select {
		border-radius: 99px;
	}
		
	.row.thongtinkhoanvay, .row.ketquakhoanvay{
		margin-right: 15px;
		margin-left: 15px;
		/*background: linear-gradient(360deg, #0270af, #0270af00);*/
		background-color : #fff;
	    box-shadow: 4px 4px 10px #ccc;
	    padding :10px;
	    border-radius: 10px;
	}

	.row.thongtinkhoanvay .col-xl-12, .ketquakhoanvay .col-xl-12 {
		font-size: 20px;
	}

	.row.thongtinkhoanvay .col-xl-6, .ketquakhoanvay .col-xl-6 {
		margin-top: 10px;
	}

	.btn-khoanvay div{
		margin-top: 20px;
	}

	.menufooter .col-xl-3 {
		text-align: center;
		padding-right: 0;
		padding-left: 0

	}

	.menufooter {
		border-top: 1px solid #ccc;
		position:  fixed;
		margin: 0 auto;
		width: 100%;
		bottom: 0;
		background: #fff;
	}
	.menufooter i {
		padding-top: 10px;
	}
	.menufooter a {
		color : var(--blue);
		font-size: 16px;
	}

	#step1 img{
		height: 180px;
		width: 100%;
		border-radius: 10px;
	}

	#step1 .col-xl-12, #step2 .col-xl-12 {
		margin-bottom: 20px;
	}
	#step1 label, #step3 label{
		position: absolute;
	    cursor: pointer;
	    margin-left: 10px;
	    height: 100%;
	    width: 100%;
	    background: transparent;
	    margin-right: 10px;
	    left: 0;
	}
	

	#step2 .col-xl-12 i {
		position: absolute;
		right: 30px;
	    top: 20%;
	    font-size: 25px;
	}

	#step2 input[type=text], #step2 select {
		border-radius: 10px;
	}


	.slider.slider-horizontal {
		width: 90%;
		height: 30px;
		margin-right: 15px;
		margin-left: 15px;
	}

	.profile .row {
		margin-left: 15px;
		margin-right: 15px;
	}

	.profile img {
		width: 40%;
		margin-top: 10px;
		border-radius: 99px;
		box-shadow: 0px 0px 20px 2px #ccc
	}

	.profile .linkprofile a {
		display: block;
		background: var(--blue);
		padding: 15px 0 15px 40px;
		width: 100%;
		color: #fff;
		margin-bottom: 10px;
		border-radius: 99px;
	}

	.profile .linkprofile a:last-child {
		background: #df2626;
	}

	.profile .linkprofile a i {
		font-size: 20px;
		padding-right: 20px;
	}

	.khoanvay img {
		width: 40%;

	}

	.kqkv {
		box-shadow: 1px 1px 10px 2px #ccc;
		background: #fff;
		border-radius: 10px;
		padding: 10px 0;
		margin-top: 10px;
		font-size: 16px;
	}

	.kqkv .row {
		padding: 10px 0;
	}

	.tooltip.in {
	  opacity: 1;
	}

	 .maqr {
		margin-right: 15px;
		margin-left: 15px	
	}
	.sodu {
		background: #f7f7f7;
		padding:10px 0;
		border-radius: 10px;
		font-weight: 600;
		font-size: 20px;
	}    

	.sodu div:nth-child(2){
		color: var(--blue);
		font-size: 25px;
	}

	.jet-link-sodu {
		display: block;
		width: 100%;
		color: #fff;
		text-align: left;
	}

	button.jet-link-sodu {
		background: transparent;
	    border: 0;
	    color: #fff;
	}

	.maqr .button-sodu {
		display: flex;
		background: var(--blue);
		color: #fff;
		padding: 15px 20px;
		border-radius: 99px;
		font-size: 16px;
	}

	.maqr .button-sodu span:before {
		font-size: 25px
	}

	.maqr img {
		border-radius: 15px;
	}

	.swal2-html-container {
		font-size: 20px;
		padding-bottom: 15px;
	}

	.hoten, .sodienthoai, .sodienthoai a, a.sodienthoai {
		position: absolute;
		color: #ca3739;
		font-weight: 600;
		padding-left: 15px;
	}

	.hoten {
		bottom: 20px;
	}

	.sodienthoai {
		bottom: 0px;
	}

	.nganhang {
		margin-bottom: 20px
	}

	.nganhang img {
		margin-bottom: 20px;
		box-shadow: 0 0 0 1px #ccc;
	}

	.trangthaivi {
		position: absolute;
	    right: 25px;
	    bottom: 0px;
	}

	.trangthaivi p {
		position: absolute;
	    width: max-content;
	    right: 45px;
	    color: #fff;
	}

	.mdi-badge-check {
		color: #0bc50b;
		font-size: 40px;
		background: #fff;
		border-radius: 99px;
		height: 30px;
    	line-height: 30px;
	}

	.mdi-close-circle {
		color: red;
		font-size: 40px;
		background: #fff;
		border-radius: 99px;
		height: 30px;
    	line-height: 30px;
	}

	.slide-khoanvay {
		display: flex; justify-content: space-between; padding-left: 10px;
		width: 97%;
	}

	.slide-khoanvay span {color: #fff; background:#4285f4; border-radius: 99px;position: relative;
    top: -26px; left: -2px; width: 15px; height: 15px;}

    .item {
		  width: 100%;
		  display: block;
		  position: relative;
		  animation: move;
		  animation-duration: 20s;

		}

	.list-donao-slide {
		height: 30px;
		overflow: hidden;
	}

	.swal2-confirm{
		background: var(--blue);
	    color: #fff;
	    border: 0;
	    padding: 10px 30px;
	    border-radius: 99px;
	}



}



@keyframes move {
  0% {
    top: 0px; 
  }
  10% {
    top: -30px;
  }
  20% {
    top: -60px;
  }
  30% {
    top: -90px;
  }
  40% {
    top: -120px;
  }
  50% {
    top: -150px;
  }
  60% {
    top: -180px;
  }
  70% {
    top: -210px;
  }
  80% {
    top: -240px;
  }
  90% {
    top: -270px;
  }
  100% {
    top: -90px;
  }


@keyframes moveicon {
	0% {
		padding-left:5px;
	}
	50% {
            padding-right: 15px;
         }

     100% {
		padding-left: 5px;
	}    
}





















input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}